/*
 * @Author: 薛严 348352046@qq.com
 * @Date: 2023-04-13 16:39:18
 * @LastEditors: 薛严 348352046@qq.com
 * @LastEditTime: 2023-04-13 17:15:53
 * @FilePath: /vite/ift-file-md5-uni-react/src/MultipleUpload.jsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import { useState } from "react"
import { getFileSignature, getFilesMd5 } from 'ift-util';
import { getOption } from './util'
const Index = () => {
  const [imageSrcs, setImageSrcs] = useState(['https://img.yzcdn.cn/vant/cat.jpeg'])
  const change = async (e) => {
    const files = e.target.files;
    // const fileType = files[0].name.split(".")[1];
    const fileType = file[0].name.slice(file[0].name.lastIndexOf('.') + 1);
    // const md5 = await hashFile(file).md5
    const md5 = await getFilesMd5(files)
    console.log(md5);
    const r = await getFileSignature("", fileType, md5);
    console.log(r);
    const form = new FormData();
    const temp = []
    for (const file of files) {
      form.append("files", file)
    }
    // form.append("files", files)
    form.append("fileType", fileType);
    console.log(md5);
    let options = getOption(r, form)
    const url =
      "https://dev-ftecard.aijiatui.com/gov-file-upload/security/batch-upload";
    const res = await fetch(url, options);
    const data = await res.json();
    console.log(data.data.fileUrls);
    setImageSrcs(data.data.fileUrls)
  }
  return (
    <>
      {imageSrcs.map((item, index) => (
        <>
          <img src={item} key={index} />
        </>
      ))}
      <p>{imageSrcs}</p>
      <div>多个文件上传</div>
      <input type="file" multiple onChange={change} />
    </>
  )
}

export default Index